<!-- /*
*   @Description:个人信息
*   @Author:lxy
*   @Date:2023-03-23 10:23
*/ -->
<template>
  <div class="personalInformation_box">
    <searchFrom ref="searchFrom" @forSubmit="forSubmit"></searchFrom>
    <el-button
      style="margin-bottom: 20px"
      type="primary"
      icon="el-icon-search"
      @click="($event) => buttonClickFunction([], '新增')"
      >新增</el-button
    >

    <!-- 表格组件 -->
    <tableTemplate
      v-bind="tableConfigObject"
      class="CHAGE_SCROLLBAR productService_table"
    >
      <template slot="btnSlotName" slot-scope="{ item }">
        <!-- <el-button
          type="text"
          @click="($event) => buttonClickFunction(item, '查看')"
          >查看</el-button
        >
        <el-button
          type="text"
          @click="($event) => buttonClickFunction(item, '编辑')"
          >编辑</el-button
        > -->
        <el-button
          type="text"
          @click="($event) => buttonClickFunction(item, '删除')"
          >删除</el-button
        >
      </template>
    </tableTemplate>
    <!-- 分页组件 -->
    <paginationTemplate
      v-bind="paginationObject"
      @currentChangeFunction="currentChangeFunction"
    ></paginationTemplate>

    <!-- 弹出框测试 -->
    <taskInFoDialog
      ref="taskInFoDialogRef"
      @okShuaxin="okShuaxin"
    ></taskInFoDialog>
  </div>
</template>

<script>
import tableTemplate from "@/components/TableTemplate.vue";
import searchFrom from "@/views/InformationManagement/personalInformation/components/searchFrom.vue";
import taskInFoDialog from "@/views/InformationManagement/personalInformation/components/taskInFoDialog.vue";
import { fromConfigTwo } from "./config/config";
import { queryPeopleHttp, delOldMessage } from "@/api/oldPeople";
import paginationTemplate from "@/components/PaginationTemplate.vue";
export default {
  name: "personalInformation",
  components: {
    searchFrom,
    taskInFoDialog,
    tableTemplate,
    paginationTemplate,
  },
  data() {
    return {
      tableConfigObject: {
        //表头数据
        elTableListData: [],
        // 表头行配置
        elTableListConfig: fromConfigTwo,
        // 分页组件使用的数据
      },
      paginationObject: {
        layout: "prev , pager, next, jumper",
        pageSizes: [10, 20, 30, 40],
        pageSize: 8,
        currentPage: 1,
        total: 10,
      },
    };
  },
  methods: {
    //获取数据
    getData() {
      let parmrs = {
        ...this.$refs.searchFrom.getSearchForm(),
        pageSize: this.paginationObject.pageSize,
        currentPage: this.paginationObject.currentPage,
      };
      queryPeopleHttp(parmrs).then((res) => {
        if (res.status != 200) return;
        this.tableConfigObject.elTableListData = res.data.data;
        this.paginationObject.total = res.data.totalpage;
      });
    },
    //删除数据
    deleteFunction(val) {
      delOldMessage(val).then((res) => {
        this.getData()
        this.$notify({
          title: "提示",
          message: "删除成功",
          type: "success",
        });
      });
    },
    buttonClickFunction(itVal, type) {
      if (type == "编辑" || type == "查看" || type == "新增") {
        this.$refs.taskInFoDialogRef?.handleOpen(itVal, type);
      } else if (type == "删除") {
        this.$confirm("此操作将永久删除该条记录, 是否继续?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        })
          .then(() => {
            this.deleteFunction(itVal);
          })
          .catch(() => {
            this.$notify.info({ title: "提示", message: "已取消删除操作" });
          });
      }
    },
    currentChangeFunction(val) {
      this.paginationObject.currentPage = val;
      this.getData();
    },
    //点击查询
    forSubmit() {
      this.paginationObject.currentPage = 1;
      this.getData();
    },
    //添加成功后刷新页面
    okShuaxin() {
      this.getData();
    },
  },
  mounted() {
    this.getData();
  },
};
</script>

<style scoped lang="less">
.personalInformation_box {
  height: 100%;
  box-sizing: border-box;
  background-color: #ffffff;
  padding: 16px 30px;
}
.productService_table {
  height: 500px;
}
</style>
